import React from 'react';
import { inject, observer } from 'mobx-react';

@inject('portalThemeStore')
@observer
class E9TopLogo extends React.Component {
  render() {
    const { portalThemeStore } = this.props;
    const { themeInfo } = portalThemeStore;
    const { themeLogo, themeLogoName, themeLogoWidth = '', themeData = {} } = themeInfo;
    const { styleConfig = {} } = themeData;
    const { toplogo = {} } = styleConfig;
    const fontSize = parseInt(toplogo.fontSize || '14px');
    const logoWidth = themeLogoWidth == '' ? 197 : parseInt(themeLogoWidth);

    return (
      <div className={`e9header-top-logo wea-f${fontSize}`} style={{ width: logoWidth }}>
        {themeLogo ? <img src={themeLogo} alt="" /> : <span>{themeLogoName}</span>}
      </div>
    );
  }
}

export default E9TopLogo;
